<!--
 * @Description: 
 * @Date: 2023-03-29 10:54:14
 * @LastEditors: czp
 * @LastEditTime: 2023-04-04 17:00:31
-->
<template>
	<div>
		<IEpUser class="user" @click="toUser" />
		<SignIn ref="signInRef" @click-reset-psd-now="resetPsdRef.open()" @click-sign-up-now="signUpRef.open()" />
		<SignUp ref="signUpRef" />
		<ResetPsd ref="resetPsdRef" />
	</div>
</template>
<script setup lang="ts">
import { useVR } from "@/hook/useVR";
import { useBaseStore } from "@/store/base";
import SignIn from "./SignIn.vue";
import SignUp from "./SignUp.vue";
import ResetPsd from "./ResetPsd.vue";

// 获取页面跳转方法
const { pageJump } = useVR();
// 获取token
const { token } = storeToRefs(useBaseStore());
// 获取透传属性
const attrs = useAttrs();
// 登录对话框
const signInRef = ref<InstanceType<typeof SignIn>>();
// 注册对话框
const signUpRef = ref<InstanceType<typeof SignUp>>();
// 忘记密码对话框
const resetPsdRef = ref<InstanceType<typeof ResetPsd>>();

/**
 * 前往个人中心
 */
const toUser = () => {
	if (!token.value) return signInRef.value.open();
	pageJump("/user");
};
</script>
<style lang="scss" scoped>
.user {
	width: 36px;
	height: 36px;
	padding: 8px;
	border: 2px solid v-bind("attrs.color");
	border-radius: 50%;
}
</style>
